<template>
  <span @click="handleDownLoad">
    <slot name="downloadLink">
      <el-button :icon="Upload" size="small" type="primary">导出</el-button>
    </slot>
  </span>
</template>

<script>
import VabDialog from "@/plugins/VabDialog/index.vue";
import { downloadFile, exportFileUrl } from "@/api/mains";
import { Download, Upload } from "@element-plus/icons-vue";
import { ElLoading } from "element-plus";
import { succMsg, confirm } from "@/utils/MessageUtils";

export default defineComponent({
  name: "ExportDirect",
  components: {},
  props: {
    url: {
      type: String,
      default: "",
      required: false
    },
    exportFileUrl: {
      type: String,
      default: "",
      required: false
    },
    downloadFileUrl: {
      type: String,
      default: "",
      required: false
    },
    expfilename: {
      type: String,
      default: ""
    },
    params: { type: Object, default: () => {} }
  },

  emits: {},
  setup(props) {
    const state = reactive({
      loading: false,
      url: "",
      expfilename: "",
      params: {}
    });
    state.url = ref(props.url);
    state.expfilename = ref(props.expfilename);
    state.params = ref(props.params);

    const handleDownLoad = () => {
      confirm("你确定要下载此文件吗", async () => {
        if (state.params == null) {
          state.params = {};
        }
        let t_exportFileUrl = `${state.url}/exportFile`;
        if (props.exportFileUrl && props.exportFileUrl != "") {
          t_exportFileUrl = props.exportFileUrl;
        }
        //Object.assign(state.params, fileNameParam)

        const loading = ElLoading.service({
          lock: true,
          text: "下载中，请稍候...",
          background: "rgba(0, 0, 0, 0.7)"
        });

        await exportFileUrl(t_exportFileUrl, {
          ...state.params,
          fileName: state.expfilename
        })
          .then(res => {
            if (res.code == 200) {
              const filepath = res.data.filepath;
              if (filepath != null && filepath != "") {
                succMsg(res.msg);
                let t_downloadFileUrl = `${state.url}/downloadFile`;
                if (props.downloadFileUrl && props.downloadFileUrl != "") {
                  t_downloadFileUrl = props.downloadFileUrl;
                }
                downloadFile(t_downloadFileUrl, { filename: filepath })
                  .then(res => {
                    const link = document.createElement("a");

                    const blob = new Blob([res], {
                      type: "application/octer-stream"
                    });

                    link.style.display = "none";

                    link.href = URL.createObjectURL(blob);

                    if (state.expfilename.indexOf(".") > 0) {
                      link.setAttribute("download", state.expfilename);
                    } else {
                      link.setAttribute("download", `${state.expfilename}.xlsx`);
                    }

                    document.body.appendChild(link);

                    link.click();

                    document.body.removeChild(link);

                    loading.close();
                  })
                  .catch(err => {
                    console.log(err);

                    loading.close();
                  });
              }
            } else {
              loading.close();
              /* failMsg(res.msg) */
            }
          })
          .catch(err => {
            loading.close();
            console.log(err);
          });
      });
    };
    watch(
      () => props.params,
      newVal => {
        state.params = newVal;
      },
      { deep: true, immediate: true }
    );
    return {
      ...toRefs(state),
      handleDownLoad,
      Download,
      Upload,
      VabDialog
    };
  }
});
</script>

<style lang="scss" scoped></style>
